<template>
	<div style="width: 75%;">
		<div class="ffffff mainpadding radius">
			<div class="text_h color_three">账户余额（元）</div>
			<div class="flexbetween margin_top2">
				<div class="total_price">{{userinfo.money}}</div>
				<div class="flexleft">
					<div class="themeBtnBg margin_right1 pointer" @click="goWithdrawal">提现</div>
					<div class="themeBtnBgSmall pointer" @click="goRecharge">充值</div>
				</div>
			</div>
		</div>
		<router-view></router-view>
	</div>
</template>

<script>
	import {
		getUserInfo
	} from "@/API/mine"
	export default {
		data() {
			return {
				userinfo: {}
			}
		},
		async created() {
			let data = await getUserInfo()
			this.userinfo = data.data.data
		},
		methods: {
			goWithdrawal() { //提现
				this.$router.push({
					path: "/mineBalance/withdrawal"
				})
			},
			goRecharge() { //充值
				this.$router.push({
					path: "/mineBalance/recharge"
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.total_price {
		font-size: 50px;
		font-family: PingFang SC-Heavy, PingFang SC;
		font-weight: 800;
		color: #3478F5;
	}

	.themeBtnBgSmall {
		padding: 10px 30px;
		background: rgba(52, 120, 245, 0.1);
		border-radius: 4px;
		border: 1px solid #3478F5;
		font-size: 12px;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #3478F5;
	}

	.themeBtnBg {
		padding: 10px 30px;
		background-color: #3478F5;
		border-radius: 4px;
		border: 1px solid #3478F5;
		font-size: 12px;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #ffffff;
	}
</style>